<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:th="http://www.thymeleaf.org"
	xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity3"
	xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout" lang="en"
	class="no-js">
<head th:fragment="setTitle(title)">
<meta charset="UTF-8">
<title th:if="${title != null}" th:text="${title}"></title>
<title th:if="${title == null}">index</title>
<link rel="stylesheet" th:href="@{/boostrap4/css/bootstrap.min.css}" />
</head>
<body style="margin:2px;">
    <div class="form-group">
        <button class="btn btn-outline-info" type="button" id="manger">控制台</button>
    </div>
    <h3>如何开始使用？</h3><hr/>
	<div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">
	  <ol class="carousel-indicators">
	    <li data-target="#carouselExampleIndicators" data-slide-to="0" class="active"></li>
	    <li data-target="#carouselExampleIndicators" data-slide-to="1"></li>
	    <li data-target="#carouselExampleIndicators" data-slide-to="2"></li>
	  </ol>
	  <div class="carousel-inner">
	    <div class="carousel-item active">
	      <img class="d-block w-100 h-50" th:src="@{images/help/pic01.png}" alt="First slide">
	    </div>
	    <div class="carousel-item">
	      <img class="d-block w-100 h-50" th:src="@{images/help/pic02.png}" alt="Second slide">
	    </div>
	    <div class="carousel-item">
	      <img class="d-block w-100 h-50" th:src="@{images/help/pic03.png}" alt="Third slide">
	    </div>
	  </div>
	  <a class="carousel-control-prev" href="#carouselExampleIndicators" role="button" data-slide="prev">
	    <span class="carousel-control-prev-icon" aria-hidden="true"></span>
	    <span class="sr-only">Previous</span>
	  </a>
	  <a class="carousel-control-next" href="#carouselExampleIndicators" role="button" data-slide="next">
	    <span class="carousel-control-next-icon" aria-hidden="true"></span>
	    <span class="sr-only">Next</span>
	  </a>
	</div>
   <div id="footer">
	    <!-- Modal -->
		<div class="modal fade bd-example-modal-sm" id="infoModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
		  <div class="modal-dialog" role="document">
		    <div class="modal-content">
		      <div class="modal-header">
		        <h5 class="modal-title" id="exampleModalLabel">提示框</h5>
		        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
		          <span aria-hidden="true">&times;</span>
		        </button>
		      </div>
		      <div class="modal-body">
		      </div>
		      <div class="modal-footer">
		        <button type="button" class="btn btn-secondary close" data-dismiss="modal">Close</button>
		      </div>
		    </div>
		  </div>
		</div>
		<!-- 询问框  -->
		<div class="modal fade bd-example-modal-sm" id="comfirmModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
		  <div class="modal-dialog" role="document">
		    <div class="modal-content">
		      <div class="modal-header">
		        <h5 class="modal-title">确定？</h5>
		        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
		          <span aria-hidden="true">&times;</span>
		        </button>
		      </div>
		      <div class="modal-body">
		      </div>
		      <div class="modal-footer">
		        <button type="button" class="btn btn-primary" id="comfirmEnter">确认</button>
		        <button type="button" class="btn btn-secondary close" data-dismiss="modal">取消</button>
		      </div>
		    </div>
		  </div>
		</div>
	    @龙眼传媒科技有限公司
	    <script th:src="@{/js/lib/jquery.min.js}"></script>
	    <script th:src="@{/js/lib/handlebars.js}"></script>
	    <script th:src="@{/boostrap4/js/bootstrap.min.js}"></script>
	    <script th:src="@{/js/lib/common.js}"></script>
	    <script th:src="@{/js/index.js}"></script>
    </div>
</body>
</html>